<template>
  <el-form
    ref="formRef"
    style="padding-left:20px;"
    label-position="left"
    class="project-file-form"
    label-width="60px">
    <el-form-item label="附件：" prop="attachment" class="attachment">
      <div class="attachment-container" style="width: 240px;">
        <!-- projectStatus: 0:待提交 1:待初审 2:待复审 3:待确认 4:待封存 5:已封存 -->
        <upAttachment
          v-if="Number(detailData.projectStatus) < 5"
          ref="uploadImg"
          :import-api="'/admin/project/file/upload'"
          :hide-confirm="true"
          :file-list="detailData.attachment || []"
          :extend-params="{
            projectId:projectId || ''
          }"
          :limit-file-size="200"
          :upload-type="0"
          :use-origin-name="true"
          btn-text="上传文件"
          @upProgress="upProgress"
          @complateSetData="complateSetData"
          @removeFileList="removeFileList" />
        <FileShowList v-else :file-list="detailData.attachment" is-show-single-file />
      </div>
    </el-form-item>
  </el-form>
</template>

<script>
import upAttachment from '@/components/Common/upAttachment/index';
import { deleteFile } from '@/api/projectDetail';
import FileShowList from '@/components/CreateOrder/fileShowList';
export default {
  components: { upAttachment, FileShowList },
  props: {
    projectId: {
      type: Number | String,
      default: ''
    },
    detailData: {
      type: Object,
      default: () => {
        return {};
      }
    }
  },
  data() {
    return {
      paramsObj: {
        attachment: []
      },
      createLoading: false
    };
  },
  created() {
  },
  methods: {
    // 上传文件
    upProgress() {
      this.createLoading = true;
    },
    complateSetData({ data, fileName }) {
      this.createLoading = false;
      this.$message.success('上传成功');
      this.$emit('getDetail');
      // const fileList = {
      //   name: fileName,
      //   url: data.url,
      //   time: new Date().getTime()
      // };
      // if (typeof data === 'string') {
      //   fileList.url = data;
      // } else {
      //   fileList.url = data.url;
      // }
      // this.paramsObj.attachment.push(fileList);
    },
    removeFileList({ file, index }) {
      const params = { id: this.projectId, url: file.url };
      deleteFile(params).then(res => {
        if (res.code === 200) {
          this.$emit('getDetail');
        }
      }).catch(() => {});
    }
  }
};
</script>

<style lang="scss" scoped>
.project-file-form {
  &::v-deep {
    .el-form-item__label {
      line-height: 32px;
    }
    .el-form-item__content {
      line-height: 32px;
    }
  }
}
</style>
